<?php
use yesf\Yesf;
?>
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>EasyAccount管理面板</title>
	<link rel="stylesheet" href="https://fonts.geekzu.org/css?family=Roboto:300,400,500,700,400italic|Material+Icons" />
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vue-material@1.0.0-beta-10.2/dist/vue-material.min.css" />
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vue-material@1.0.0-beta-10.2/dist/theme/default.css" />
	<link rel="stylesheet" href="<?=$__PUBLIC_URL?>admin.css" />
	<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.min.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/vue-material@1.0.0-beta-10.2/dist/vue-material.min.js"></script>
</head>
<body>
	<div id="app">
		<md-app md-waterfall md-mode="fixed">
			<md-app-toolbar class="md-primary">
				<span class="md-title">EasyAccount管理面板</span>
			</md-app-toolbar>
			<md-app-drawer md-permanent="full">
				<md-list md-expand-single>
					<md-list-item @click="switchPage('config')">
						<md-icon>settings</md-icon>
						<span class="md-list-item-text">设置</span>
					</md-list-item>
					<md-list-item @click="switchPage('user')">
						<md-icon>people</md-icon>
						<span class="md-list-item-text">用户</span>
					</md-list-item>
					<md-list-item @click="switchPage('group')">
						<md-icon>group</md-icon>
						<span class="md-list-item-text">用户组</span>
					</md-list-item>
					<md-list-item @click="loginout">
						<md-icon>exit_to_app</md-icon>
						<span class="md-list-item-text">退出登录</span>
					</md-list-item>
				</md-list>
			</md-app-drawer>
			<md-app-content v-show="activePage == 'config'">
				<md-button class="with-icon" @click="loadConfig"><md-icon>refresh</md-icon>刷新</md-button>
				<md-button class="with-icon" @click="saveConfig"><md-icon>save</md-icon>保存</md-button>
				<div class="config-form">
					<md-field v-for="c of config" :key="c.id">
						<label :for="`config_${c.id}`">{{c.name}}</label>
						<md-input :id="`config_${c.id}`" v-model="c.value"/>
					</md-field>
				</div>
			</md-app-content>
			<md-app-content v-show="activePage == 'user'">
				<md-field>
					<label>搜索用户</label>
					<md-input v-model="searchUserInput"></md-input>
				</md-field>
				<md-button class="with-icon" @click="searchUser('mail')"><md-icon>mail</md-icon>搜邮箱</md-button>
				<md-button class="with-icon" @click="searchUser('phone')"><md-icon>call</md-icon>搜手机</md-button>
				<md-button class="with-icon" @click="showAllUser"><md-icon>apps</md-icon>全部</md-button>
				<md-button class="with-icon" @click="editUser(null)"><md-icon>create_new_folder</md-icon>新建</md-button>
				<md-table>
					<md-table-row>
						<md-table-head md-numeric>ID</md-table-head>
						<md-table-head>状态</md-table-head>
						<md-table-head>昵称</md-table-head>
						<md-table-head>邮箱</md-table-head>
						<md-table-head>注册时间</md-table-head>
						<md-table-head>操作</md-table-head>
					</md-table-row>
					<md-table-row v-for="u of user" :key="u.id">
						<md-table-cell md-numeric>{{u.id}}</md-table-cell>
						<md-table-cell>{{u.status == 1 ? '正常' : u.status}}</md-table-cell>
						<md-table-cell>{{u.nickname}}</md-table-cell>
						<md-table-cell>{{u.mail}}</md-table-cell>
						<md-table-cell>{{u.register}}</md-table-cell>
						<md-table-cell>
							<md-button class="with-icon" @click="showSetUserStatus(u)"><md-icon>block</md-icon>设置状态</md-button>
							<md-button class="with-icon" @click="editUser(u)"><md-icon>edit</md-icon>修改信息</md-button>
							<md-button class="with-icon" @click="delUser(u)"><md-icon>delete</md-icon>删除</md-button>
						</md-table-cell>
					</md-table-row>
				</md-table>
			</md-app-content>
		</md-app>
		<md-dialog :md-active.sync="edit_user.show">
			<md-dialog-title>编辑/新建</md-dialog-title>
			<md-dialog-content>
				<md-field>
					<label>昵称</label>
					<md-input v-model="edit_user.nickname"></md-input>
				</md-field>
				<md-field>
					<label>姓名</label>
					<md-input v-model="edit_user.realname"></md-input>
				</md-field>
				<md-field>
					<label>手机号</label>
					<md-input v-model="edit_user.phone"></md-input>
				</md-field>
				<md-field>
					<label>邮箱</label>
					<md-input v-model="edit_user.mail"></md-input>
				</md-field>
				<md-field>
					<label>头像</label>
					<md-input v-model="edit_user.avatar"></md-input>
				</md-field>
				<md-field>
					<label>密码</label>
					<md-input v-model="edit_user.password"></md-input>
				</md-field>
			</md-dialog-content>
			<md-dialog-actions>
				<md-button class="md-primary" @click="edit_user.show = false">取消</md-button>
				<md-button class="md-primary" @click="editUserSave">保存</md-button>
			</md-dialog-actions>
		</md-dialog>
		<md-dialog-prompt
			:md-active.sync="setUserStatus.show"
			v-model="setUserStatus.status"
			md-title="设置用户状态（1-9）"
			md-input-maxlength="1"
			md-confirm-text="保存"
			@md-confirm="onSetUserStatus" />
		<md-dialog-alert
			:md-active.sync="resetPwd.show"
			:md-content="`密码已重置为{$resetPwd.result}`" />
		<md-snackbar md-position="center" :md-duration="3000" :md-active.sync="toast.show" md-persistent>
			<span>{{toast.message}}</span>
		</md-snackbar>
		<md-dialog :md-active="showLogin" :md-close-on-esc="false" :md-click-outside-to-close="false">
			<md-dialog-title>登录</md-dialog-title>
			<div style="text-align:center" v-show="status == 0"><md-progress-spinner md-mode="indeterminate" ></md-progress-spinner></div>
			<md-dialog-content v-show="status == 1">
				<md-tabs class="md-transparent" md-alignment="fixed">
					<md-tab id="tab-login-normal" md-label="普通管理员">
						<iframe :src="loginFrame" frameborder="0"></iframe>
					</md-tab>
					<md-tab id="tab-login-super" md-label="超级管理员">
						<md-field>
							<label>密码</label>
							<md-input v-model="password"></md-input>
						</md-field>
						<md-button class="md-primary" @click="tryLogin">登录</md-button>
					</md-tab>
				</md-tabs>
			</md-dialog-content>
		</md-dialog>
	</div>
	<script>
	var BASE_URI='<?=Yesf::getBaseUri()?>';
	var LOGIN_FRAME = '';
	</script>
	<script src="<?=$__PUBLIC_URL?>admin.js"></script>
</body>
</html>